<div class="hero user-hero">
  <div class="container">
    <div class="row">
      <div class="col-md-12">
        <div class="hero-ct">
          <h1>{{title}}</h1>
          <ul class="breadcumb">
            <li class="active"><a href="/">首页</a></li>
            <li><span class="ion-ios-arrow-right"></span>{{title}}</li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="page-single">
  <div class="container">
    <div class="row ipad-width2">
      <div class="col-md-3 col-sm-12 col-xs-12">
        <div class="user-information">
          <div class="user-img">
            <a><img src="../../../assets/images/uploads/user-img.png" alt=""><br></a>
            <a class="redbtn">更改头像</a>
          </div>
          <div class="user-fav">
            <ul>
              <li [ngClass]="{'active':tabIndex==0}"><a [routerLink]="[{outlets:{userHome:'details'}}]"
                                                        (click)="tabIndex=0;changeTitle('用户详情')">用户详情</a></li>
              <li [ngClass]="{'active':tabIndex==1}"><a [routerLink]="[{outlets:{userHome:'favorite'}}]"
                                                        (click)="tabIndex=1;changeTitle('用户收藏')">用户收藏</a></li>
              <li [ngClass]="{'active':tabIndex==2}"><a [routerLink]="[{outlets:{userHome:'rate'}}]"
                                                        (click)="tabIndex=2;changeTitle('评分记录')">评分记录</a></li>
            </ul>
          </div>
          <div class="user-fav">
            <p>其他</p>
            <ul>
              <li><a [routerLink]="[{outlets:{userHome:'details'}}]">修改密码</a></li>
              <li><a (click)="logout()">退出登录</a></li>
            </ul>
          </div>
        </div>
      </div>
      <!---->
      <router-outlet name="userHome"></router-outlet>
    </div>
  </div>
</div>
